<!--资产列表 -->
<template>
    <div class="page assetsList-page" data-page="assetsNextChild" style="z-index: 2;">
        <div class="link-page-nav">
            <a href="#" class="link" @click="$root.backToTab()">
                <i class="iconfont icon-zuo"></i>
            </a>
        </div>
        <div class="link-page-search">
            <span class="tt">消防资产</span>
        </div>
        <div class="page-content pdbottom120">
            <ul id="assets-info-list{{getNewId}}" style="height:100%"></ul>
        </div>
        <div class="more-task-btn" @click="scanning">
            <i class="iconfont icon-weibiaoti--2"></i>
        </div>

    </div>
</template>
<script>
    return {
        mounted() {
            var self = this;
            var app = self.$app;
            //页面传参
            self.currentOrgId = this.$route.params.orgId;
            self.fbsId = this.$route.params.fbsId;
            self.fbsName = this.$route.params.fbsName;

        },
        data: function () {
            return {
                pageName: "assetsNextChild",
                selectContent: '',
                chargeBuildId: 0,//建筑物id
                buildName: "",
                getNewId: (new Date()).getTime(),
            }
        },
        methods: {
            //原生扫一扫
            scanning: function () {
                native.scanQrCode();
            },
            //获取列表数据
            getAssetsInfo: function (fbsId,itemFbsId) {
                var self = this;
                var $ = self.$;
                $(`#assets-info-list${self.getNewId}`).empty();
                if (fbsId == 0) {
                    self.fbsId = 0
                }
                //增加类别选项
                Dao.getAssetsCountByFbs({
                    orgId: self.currentOrgId,
                    type: 0,
                    fbsId: itemFbsId||self.fbsId
                }, function (data) {
                    if (data && data.length > 0) {
                        for (var i = 0; i < data.length; i++) {
                            $(`#assets-info-list${self.getNewId}`).append(`
                                <li class="assets-info-tital" id="categoryId_`+ data[i].fbsId + `_${self.getNewId}">
                                    <div class="assets-type-name">`+ data[i].fbsName + `</div>
                                    <div class="assets-line">
                                        <div class="assets-item assets-need-maintain" style="width:28%">
                                            <p class="assets-item-title">资产类别</p>
                                            <p class="assets-item-num">`+ data[i].type + `<span span class="assets-item-unit">种</span</p>
                                        </div>
                                        <div class="assets-item assets-need-maintain" style="width:28%">
                                            <p class="assets-item-title">资产总数</p>
                                            <p class="assets-item-num assets-item-color">`+ data[i].total + `<span span class="assets-item-unit">个</span</p>
                                        </div>
                                        <div class="assets-item assets-need-maintain" style="width:28%">
                                            <p class="assets-item-title">过期资产数</p>
                                            <p class="assets-item-num">`+ data[i].expireCount + `<span class="assets-item-unit">个</span</p>
                                        </div>
                                        <div data-id=${data[i].fbsId} style="position:absolute;right:20px;top:20px" class="`+ (data[i].isHaveChild == 1 ? 'showDomChild' : 'hideDom') + `"><i class="iconfont icon-youjiantou" style="font-size:32px"></i></div>
                                    </div>
                                </li>
                                `);
                            
                            //资产列表
                            jQuery(`#categoryId_${data[i].fbsId}_${self.getNewId}`).off("click").on("click", { 'data': data[i] }, function (e) {
                               app.router.navigate("/assetsList/" + self.currentOrgId + '/' + e.data.data.fbsName + '/' + e.data.data.type + '/' + e.data.data.total + '/' + e.data.data.expireCount + '/-1/' + e.data.data.fbsId + '/' + self.fbsName + '/');
                            });
                        }
                        // // 资产子级
                        jQuery(".showDomChild").off("click").on("click", function (e) {
                                e.stopPropagation();
                                let id=jQuery(this).attr('data-id')
                                self.getAssetsInfo(1,id)
                            });
                    } else {//没有数据
                        $(`#assets-info-list${self.getNewId}`).empty().append(`<div class="no-data-img"><img src="` + listNoDataPic() + `"/></div>`);
                    }
                });
            },
            backToTab: function () {
                app.methods.backToTab();
            },
            removeScreen: function () {
                var self = this;
                self.fbsName = '选择建筑物'
                $("#trouble_bulid").html("选择建筑物");
                $("#trouble_bulid").removeClass('select-active');
                $("#assets_build").removeClass('select-active');
                self.getAssetsInfo(0);
            },
            //选择建筑
            select_build: function () {
                var self = this;
                loadSelectBuildFun(self.currentOrgId, function (data) {
                    self.chargeBuildId = data.buildId;
                    self.fbsId = self.chargeBuildId;
                    self.buildName = data.buildName;
                    self.fbsName = self.buildName;
                    $("#trouble_bulid").html(data.buildName);
                    $("#trouble_bulid").addClass('select-active');
                    $("#assets_build").addClass('select-active');
                    self.getAssetsInfo(self.chargeBuildId);
                });
            },
        },
        on: {
            pageInit: function (e, page) {
                var self = this;
                var $ = self.$;
                $("#trouble_bulid").click(function () {
                    self.select_build();
                })
            },
            pageBeforeIn: function (e, page) {
                this.getAssetsInfo(self.fbsId);
                if (self.fbsId != 0) {
                    $("#trouble_bulid").html(self.fbsName);
                    //$("#trouble_bulid").addClass('select-active');
                }
            },
            pageAfterIn: function (e, page) {
                var self = this;
                var $ = self.$;
            },
            pageBeforeRemove: function (e, page) {

            }
        }
    }
</script>
<style scoped>
    .unitStat-list-dslist ul:before {
        height: 0 !important;
    }

    .select-option {
        padding: 10px 5px;
        font-size: 12px;
        z-index: 3;
        position: fixed;
        width: 100%;
        margin-top: 48px;
    }

    .moreDectorState-page .unitStat-list-dslist {
        padding-top: 25px;
    }

    .global-search {
        background: #fff;
        height: 48px;
        color: #666666 !important;
        font-size: 12px;
        text-align: center;
        line-height: 48px;
    }

    .global-search i {
        font-size: 15px;
        line-height: 48px;
        overflow: hidden;
    }

    .item-title span {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        font-size: 12px;
    }

    .decter-name {
        font-size: 16px !important;
    }

    .item-inner div {
        line-height: 25px;
    }

    .assets-status span {
        color: #2471CA;
        padding-right: 10px;
    }
    .hideDom{
        display: none;
    }
</style>